<!--
 *Author：jxx
 *Date：{Date}
 *Contact：283591387@qq.com
 *业务请在@/extension/mes/mes/MaterialUsedListDetail.jsx或MaterialUsedListDetail.vue文件编写
 *新版本支持vue或【表.jsx]文件编写业务,文档见:https://doc.volcore.xyz/docs/view-grid、https://doc.volcore.xyz/docs/web
 -->
<template>
    <div class="right">
        <view-grid ref="grid" :columns="columns" :detail="detail" :details="details" :editFormFields="editFormFields"
            :editFormOptions="editFormOptions" :searchFormFields="searchFormFields"
            :searchFormOptions="searchFormOptions" :table="table" :extend="extend" :onInit="onInit" :onInited="onInited"
            :searchBefore="searchBefore" :searchAfter="searchAfter" :addBefore="addBefore" :updateBefore="updateBefore"
            :rowClick="rowClick" :modelOpenBefore="modelOpenBefore" :modelOpenAfter="modelOpenAfter">
            <!-- 自定义组件数据槽扩展，更多数据槽slot见文档 -->
            <template #gridHeader>
            </template>
        </view-grid>
    </div>
    <div :class="{ 'productPickMaterial': isHomePage }">
        <ProductPickMaterial class="productPickMaterial" ref="productPickMaterialRef"></ProductPickMaterial>
    </div>
</template>
<script setup lang="jsx">
//引用要显示的页面
import ProductPickMaterial from './ProductPickMaterial.vue'

import extend from "@/extension/mes/mes/MaterialUsedListDetail.jsx";
import viewOptions from './MaterialUsedListDetail/options.js'
import { ref, reactive, getCurrentInstance, watch, onMounted } from "vue";

const grid = ref(null);
const { proxy } = getCurrentInstance()
//http请求，proxy.http.post/get
const { table, editFormFields, editFormOptions, searchFormFields, searchFormOptions, columns, detail, details } = reactive(viewOptions())
const productPickMaterialRef = ref()
// 切换方法
const isHomePage = ref(true);

let gridRef;//对应[表.jsx]文件中this.使用方式一样
//生成对象属性初始化
const onInit = async ($vm) => {
    gridRef = $vm;
    //与jsx中的this.xx使用一样，只需将this.xx改为gridRef.xx
    //更多属性见：https://doc.volcore.xyz/docs/view-grid

    //默认不加载数据
    gridRef.load = false
}
//生成对象属性初始化后,操作明细表配置用到
const onInited = async () => {
    columns.forEach(x => {
        //开启表头过滤
        x.filterData = true;
    })

    gridRef.height = 200;

    gridRef.buttons.splice(2, 0, {
        name: '生成生产领料', //按钮名称
        icon: 'el-icon-document', //按钮图标:组件示例->图标
        //primary、success、warning、error、info、text、danger
        type: 'primary',
        plain: true,
        onClick: () => {
            isHomePage.value = false;
            productPickMaterialAdd(1)
        }
    })
    gridRef.buttons.splice(2, 0, {
        name: '生成生产补料', //按钮名称
        icon: 'el-icon-document', //按钮图标:组件示例->图标
        //primary、success、warning、error、info、text、danger
        type: 'primary',
        plain: true,
        onClick: () => {
            isHomePage.value = false;
            productPickMaterialAdd(2)
        }
    })

    gridRef.buttons.forEach(x => {
        x.hidden = true;
        if (x.name == "生成生产领料" || x.name == "生成生产补料") {
            x.hidden = false;
        }
    })
}
// 生产领料单页面
const productPickMaterialAdd = (x) => {
    const materialUsedRows = getMaterialUsedSelectRow();
    let selectRows = gridRef.getSelectRows();
    console.log(gridRef.editFormFields)

    if (materialUsedRows[0].AuditStatus == 0 || materialUsedRows[0].AuditStatus == null) {
        proxy.$message.error("该用料清单未审核！");
        return
    }

    if (materialUsedRows.length == 0) {
        proxy.$message.error("请选择用料清单！");
        return
    }

    let url = 'api/ProductPickMaterial/BuildProductPickMaterial';

    proxy.http.post(url, selectRows).then((result) => {

        setTimeout(() => {
            if (x == 1) {
                productPickMaterialRef.value.$refs.grid.editFormFields.BillTypeId = 1
            } else if (x == 2) {
                productPickMaterialRef.value.$refs.grid.editFormFields.BillTypeId = 2
            }
            productPickMaterialRef.value.$refs.grid.editFormFields.MaterialUsedListId = materialUsedRows[0].MaterialUsedListId
            productPickMaterialRef.value.$refs.grid.editFormFields.MaterialUsedListNo = materialUsedRows[0].BillNo
            productPickMaterialRef.value.$refs.grid.editFormFields.ProductTaskId = materialUsedRows[0].ProductTaskId
            productPickMaterialRef.value.$refs.grid.editFormFields.ProductTaskNo = materialUsedRows[0].ProductTaskNo
            productPickMaterialRef.value.$refs.grid.editFormFields.MaterialId = materialUsedRows[0].MaterialId
            productPickMaterialRef.value.$refs.grid.editFormFields.MaterialNo = materialUsedRows[0].MaterialNo
            productPickMaterialRef.value.$refs.grid.editFormFields.MaterialName = materialUsedRows[0].MaterialName
            productPickMaterialRef.value.$refs.grid.editFormFields.Spec = materialUsedRows[0].Spec
            productPickMaterialRef.value.$refs.grid.editFormFields.MaterialTypeId = materialUsedRows[0].MaterialTypeId
            productPickMaterialRef.value.$refs.grid.editFormFields.DepartmentId = materialUsedRows[0].DepartmentId

            result.productPickMaterialDetail.forEach(selectRow => {

                productPickMaterialRef.value.$refs.grid.getTable("ProductPickMaterialDetail").addRow({
                    MaterialUsedListDetailId: selectRow.materialUsedListDetailId,
                    MaterialId: selectRow.materialId,
                    MaterialNo: selectRow.materialNo,
                    MaterialName: selectRow.materialName,
                    Spec: selectRow.spec,
                    MaterialTypeId: selectRow.materialTypeId,
                    UnitId: selectRow.unitId,
                    IsBackflush: selectRow.isBackflush,
                    IsLoted: selectRow.isLoted,
                    DepartmentId: selectRow.departmentId,
                    UseMaterialQty: selectRow.useMaterialQty,
                    IsCriticalParts: selectRow.isCriticalParts,
                    ActualQty: null
                })
            })

        }, 400);
    })

    productPickMaterialRef.value.$refs.grid.add()


}

const searchBefore = async (param) => {
    //界面查询前,可以给param.wheres添加查询参数
    //返回false，则不会执行查询
    const materialUsedRows = getMaterialUsedSelectRow();
    if (!materialUsedRows.length) {
        proxy.$message.error('请先选择【用料清单】数据')
        return false;
    }
    //查询前获取用料清单的id，查询明细表
    param.wheres.push({ name: "MaterialUsedListId", value: materialUsedRows[0].MaterialUsedListId })
    return true;
}
const searchAfter = async (rows, result) => {
    return true;
}
const addBefore = async (formData) => {
    //新建保存前formData为对象，包括明细表，可以给给表单设置值，自己输出看formData的值

    const MaterialUsedListId = getMaterialUsedSelectRow()[0].MaterialUsedListId;
    formData.mainData['MaterialUsedListId'] = MaterialUsedListId
    return true;
}
const updateBefore = async (formData) => {
    //编辑保存前formData为对象，包括明细表、删除行的Id
    return true;
}
const rowClick = ({ row, column, event }) => {
    //查询界面点击行事件
    grid.value.toggleRowSelection(row); //单击行时选中当前行;
}
const getMaterialUsedSelectRow = () => {
    const fn = proxy.base.getItem('getMaterialUsedSelectRow');
    return fn();
}
const modelOpenBefore = async (row) => {//弹出框打开后方法
    const bomRows = getMaterialUsedSelectRow();
    if (!bomRows.length) {
        proxy.$message.error('请先选择【用料清单】数据')
        return false;
    }
    return true;//返回false，不会打开弹出框
}
const modelOpenAfter = (row) => {
    //弹出框打开后方法,设置表单默认值,按钮操作等
}
//监听表单输入，做实时计算
//watch(() => editFormFields.字段,(newValue, oldValue) => {	})
//对外暴露数据
defineExpose({})
</script>

<style scoped lang="less">
// 5、默认隐藏引用的页面
.productPickMaterial ::v-deep(.layout-container) {
    display: none;
}
</style>
